<script lang="ts" setup>
import logoImage from "@/assets/logo.png";

const tone = {
  value: "default",
  options: [
    {
      value: "default",
      label: "默认音色",
    },
    {
      value: "bassDrum",
      label: "低音鼓",
    },
    {
      value: "clap",
      label: "鼓掌",
    },
    {
      value: "claves",
      label: "响棒",
    },
    {
      value: "rimshot",
      label: "鼓边击",
    },
  ],
};
//https://gitee.com/fish--big/my-images
</script>

<template>
  <t-navbar :fixed="false">
    <template #left>
      <t-image :src="logoImage" fit="cover" class="logo" />
    </template>
    <template #right>
      <t-dropdown-menu>
        <t-dropdown-item :options="tone.options" :value="tone.value" />
      </t-dropdown-menu>
    </template>
  </t-navbar>
</template>

<style lang="less" scoped>
.logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}

.t-icon-home {
  margin-right: 8px;
}
</style>
